import { useNavigate, useLocation } from 'react-router-dom';
import { Layout, Menu, theme } from 'antd';
import React from 'react';
const { Header, Content, Sider } = Layout;
const items = [
    {
        key: "/nav/home",
        label: "首页"
    },
    {
        key: "2",
        label: "店铺管理",
        children: [
            {
                key: "/nav/myfrom",
                label: "店铺列表"
            },
            {
                key: "/nav/addfrom",
                label: "添加店铺"
            }
        ]
    },
    {
        key: "3",
        label: "账号管理",
        children: [
            {
                key: "/nav/myuser",
                label: "账号列表"
            },
            {
                key: "/nav/adduser",
                label: "添加账号"
            }
        ]
    }
]

export default function Mysate() {
    const navigate = useNavigate();
    const location = useLocation();
    console.log("location",location)
    const {
        token: { colorBgContainer },
    } = theme.useToken();

    function clickMenu(params) {
        console.log("params", params)
        const [path,titleKey]=params.keyPath
        navigate(path,{state:titleKey});
        if(titleKey){
            localStorage.titleKey=titleKey
        }else{
            localStorage.removeItem("titleKey")
        }
    }
    return (
        <Sider
            width={200}
            style={{
                background: colorBgContainer,
            }}
        >
            <Menu
                mode="inline"
                defaultSelectedKeys={[location.pathname]}
                defaultOpenKeys={[location.state]}
                style={{
                    height: '100%',
                    borderRight: 0,
                }}
                onClick={clickMenu}
                items={items}
            />
        </Sider>
    )
}
